const HtmlWebpackPlugin = require('html-webpack-plugin');
const path  = require('path');
const webpack = require ("webpack");


module.exports= {
    mode:"development",
    entry:{
        "bundle":'./main.js'
    },
    output:{
        filename:'[name].js'
    },
    // resolve:{
    //     alias:{
    //         '@':resolve('src')
    //     } 
    // },
    module:{
        rules:[
            {
                test:'/.css$/',
                use:[ {loader:'style-loader!css-loader'},
                      {loader:'css-loader!less-loader'}
                     
                    ]
            },
            {
                test:'/.less$/',
                use:[ {loader:'style-loader'},
                      {loader:'css-loader'},
                      {loader:'less-loader'}

                    ]
            },
            {
                test:'/\.(png|jpg|gif|ttf)$/',
                use:[{loader:'url-loader?limit=20000'}]
            },{
                test:'/.vue$/',
                use:[{loader:'vue-loader'}]
            },{
                test: /\.js$/,
                use: ['babel-loader'],
            }
        ]
    },
    plugins:[
        new HtmlWebpackPlugin({template:'./index.html'}),
        new webpack.HotModuleReplacementPlugin(),
    ],
    devServer:{
        contentBase: './dist', //网站的根目录为 根目录/dist，如果配置不对，会报Cannot GET /错误
        port: 9000, //端口改为9000
        open:true // 自动打开浏览器，适合懒人
    },
}